<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="html" uri="http://struts.apache.org/tags-html-el" %>
<%@ taglib uri="http://amc.af.mil/radtaglibrary" prefix="rad" %>
<%@ taglib uri="http://amc.af.mil/portal-el" prefix="portal" %>
<%@ taglib uri="http://java.sun.com/jstl/core" prefix="c" %>
<rad:useBean id="adpeAccountViewHelper"/>
<html>
<head>
    <title>Transfer Equipment Items</title>
</head>

<body>

<div id="portal-left-bar">
    <jsp:include page="../navigation/navigationMenu.jsp"/>
</div>

<div id="portal-content">
    <portal:box title="Transfer Item" style="width: 80%">
        <div id="standard">
            <html:form action="equipmentItem/transfer.do" method="post">
            <p>
                <label for="adpeAccountId">Destination Account</label>
                <html:select property="adpeAccountId" styleId="adpeAccountId">
                    <html:optionsCollection name="adpeAccountViewHelper"
                                            property="all"
                                            label="name"
                                            value="id"/>
                </html:select>
            </p>

            <p>
                <label for="serialNumber">Serial</label>
                <html:text property="serialNumber" styleId="serialNumber"/>
                <button type="button" onclick="javascript:addRowAction();">Add Item To List</button>
            </p>

            <table id="equipmentItemTable" style="width: 100%; border-width: 1">
                <thead>
                    <tr>
                        <th>Manufacturer</th>
                        <th>Description</th>
                        <th>Serial</th>
                        <th>Action</th>
                    </tr>
                </thead>
                </table>

                <p>&nbsp;</p>

                <p style="text-align:center">
                    <html:submit value="Transfer"/>
                </p>
                </html:form>
        </div>
    </portal:box>
</div>
<script type="text/javascript">

    function getItemBySerialAction() {

    }

    function addRowAction() {

        var myAjax = new Ajax.Request(
                'equipmentItem/getBySerial.do?search=' + document.getElementById('serialNumber').value,
        {
            Accept: 'application/json',
            method: 'get',
            onSuccess: function(t) {
                var json = t.responseText.evalJSON(true);
                var jsonObject = json[0];

                var newRow = Builder.node('tr', {id: json.id + "-row"}, [
                        Builder.node('td', json.manufacturerName),
                        Builder.node('td', json.description),
                        Builder.node('td', json.name),
                        Builder.node('td', [
                                Builder.node('input', {type:'button',value:'Remove',
                                    onclick:"javascript: Element.remove(document.getElementById('" + json.id + "-row')); return null;"}),
                                Builder.node('input', {type: 'hidden', value: json.id, id: json.id, name: 'pkgItemId'})
                                ])
                        ]);

                document.getElementById('equipmentItemTable').appendChild(newRow);

            },
            onFailure: function(t) {

            }
        }
                )
    }

</script>
</body>

</html>